<template>
    <gui-modal ref="paypopup" title="支付方式" isCloseBtn :canCloseByShade="false"
        titleStyle="background:orange;line-height:100rpx; font-size:40rpx;color:white;">
        <view class="gui-radio-lable" slot="content">
            <view class="gui-flex gui-align-items-center gui-justify-content-center  gui-border-t height" @tap="paytype(1)">
                微信支付
            </view>
            <view class="gui-flex gui-align-items-center gui-justify-content-center  gui-border-t height" @tap="paytype(0)">
                余额 (￥{{  userBalance }})
            </view>
        </view>
    </gui-modal>
</template>

<script setup >
import { ref, reactive, defineEmits,defineExpose} from 'vue'
import {userInfo} from '@/api/user'
const emit = defineEmits(['payType'])
const paypopup = ref('')
const userBalance = ref('')
const showPayPopup = async ()=>{
    paypopup.value.open()
    const  { game_currency } = await userInfo()
    userBalance.value = game_currency
}
const closePayPopup = ()=>{
    paypopup.value.close()
}
const paytype = (type)=>{
    emit('payType',type)
}

defineExpose({ showPayPopup,closePayPopup })
</script>

<style  scoped>
 .height {
   height: 100rpx;
   background-color: #fff;
 }
</style>